// 登入
function loginUser() {
  this.oLogBox = document.querySelector(".login_pwd_box")
  this.otelErr = this.oLogBox.querySelector(".tel_err_tip")
  this.oPwdErr = this.oLogBox.querySelector(".pwd_err_tip")
  this.oMsgL = this.oLogBox.querySelector(".login_msg_link")
  this.oRegL = this.oLogBox.querySelector(".login_reg_link")
  this.oFindL = this.oLogBox.querySelector(".login_find_link")
  this.oInpTel
  this.oInpPa
  this.tellnum
  this.pwd
  this.logEvent()
}

loginUser.prototype.logChecking = function () {

  //登入验证
  login({
    tellnumber: this.tellnum,
    password: this.pwd
  }).then(res => {
    console.log(res);
    if (!this.pwd) {
      this.otelErr.style.display = "block"
      this.otelErr.innerHTML = "请输入用户密码"
      return
    }
    if (res.status == false) {
      this.otelErr.style.display = "block"
      this.otelErr.innerHTML = res.mag
      return
    }
    if (res.status == true) {
      localStorage.setItem('ACTIVE_USER', this.tellnum);
      const historyURL = location.search.replace('?HISTORY=', '');
      if (historyURL) {
        location.href = historyURL;
      } else {
        location.href = "../html/littleDuck.html"
      }
    }
  })

}

loginUser.prototype.logEvent = function () {
  this.oLogBox.onclick = (e) => {
    let target = e.target
    if (target.classList.contains("login_btn")) {
      this.oPwdErr.style.display = "none"
      this.otelErr.style.display = "none"

      this.oInpTel = this.oLogBox.querySelector(".login_telephone")
      this.oInpPad = this.oLogBox.querySelector(".login_password")
      this.tellnum = this.oInpTel.value
      this.pwd = this.oInpPad.value
      console.log(this.tellnum, this.pwd);

      this.logChecking()
    }

  }
}
new loginUser()


//注册
function regUser() {
  this.oRegBox = document.querySelector(".reg_box")
  this.otelErr = this.oRegBox.querySelector(".tel_err_tip")
  this.oCodeErr = this.oRegBox.querySelector(".code_err_tip")
  this.oPwdErr = this.oRegBox.querySelector(".pwd_err_tip")
  this.oNextPwdErr = this.oRegBox.querySelector(".nextpwd_err_tip")
  this.oRegL = this.oRegBox.querySelector(".reg_link")
  this.oCode = this.oRegBox.querySelector(".login_get_code")
  this.oTrack = this.oRegBox.querySelector(".reg_slide_track")
  this.oLump = this.oRegBox.querySelector(".reg_slide_lump")

  this.oInpTel
  this.oInpPa
  this.tellnum
  this.pwd
  this.nextpwd
  this.code

  this.maxX
  this.LumpFlag = false
  this.RegEvent()
}


regUser.prototype.regChecking = function () {
  let telreg = /^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[189]))\d{8}$/

  let pwdreg = /^\S*(?=\S{6,})(?=\S*\d)(?=\S*[A-Z])(?=\S*[a-z])(?=\S*[!@#$%^&*? ])\S*$/

  this.pwd = this.pwd.trim();

  if (telreg.test(this.tellnum)) {
    if (pwdreg.test(this.pwd)) {
      console.log(132);
      if (this.pwd == this.nextpwd) {
        if (this.code == this.oCode.innerHTML) {
          if (this.LumpFlag) {
            reg({
              tellnumber: this.tellnum,
              password: this.pwd
            }).then(res => {
              if (res.status !== false) {
                console.log(res);
                alert("注册成功")
                $(".reg_box").css("display", "none")
                $(".login_pwd_box").css("display", "block")
              } else {
                this.otelErr.style.display = "block"
                this.otelErr.innerHTML = "手机号已被注册"
              }
            })
          } else {
            $(".reg_slide_tip").css("display", "none")
            $(".slide_err_tip").css("display", "inline")
          }
        } else {
          this.oCodeErr.style.display = "block"
          this.oCodeErr.innerHTML = "验证输入错误"
        }

      } else {
        this.oNextPwdErr.style.display = "block"
        this.oNextPwdErr.innerHTML = "两次密码输入不一致"
      }

    } else {
      this.oPwdErr.style.display = "block"
      this.oPwdErr.innerHTML = "密码最少6位,至少包括位1个大写字母,1个小写字母,1个特殊字符"
    }

  } else {
    this.otelErr.style.display = "block"
    this.otelErr.innerHTML = "请输入正确手机号"
  }

}

regUser.prototype.RegEvent = function () {
  this.oRegBox.onclick = (e) => {
    let target = e.target
    if (target.classList.contains("login_btn")) {
      this.oPwdErr.style.display = "none"
      this.oCodeErr.style.display = "none"
      this.otelErr.style.display = "none"
      this.oNextPwdErr.style.display = "none"
      $(".reg_slide_tip").css("display", "inline")
     $(".slide_err_tip").css("display", "none")

      this.oInpTel = this.oRegBox.querySelector(".login_telephone")
      this.oInpCode = this.oRegBox.querySelector(".login_code")
      this.oInpPad = this.oRegBox.querySelector(".login_password")
      this.oInpNextPad = this.oRegBox.querySelector(".login_nextpassword ")

      this.tellnum = this.oInpTel.value
      this.nextpwd = this.oInpNextPad.value
      this.pwd = this.oInpPad.value
      this.code = this.oInpCode.value
      this.regChecking()

    }

    if (target.classList.contains("login_get_code")) {
      this.oCode.innerHTML = "1234"
    }

  }

  // if (target.classList.contains("login_links")) {

  // }

  //滑动验证
  this.oLump.onmousedown = (e) => {
    this.maxX = this.oTrack.clientWidth - this.oLump.offsetWidth
    //按下获取鼠标到大盒子距离
    const gapX = e.offsetX
    let border = parseFloat(getComputedStyle(this.oTrack)["border-width"])
    //鼠标滑动
    this.oTrack.onmousemove = (e) => {
      //滑块跟随鼠标移动
      let x = e.clientX - this.oTrack.offsetLeft - border - gapX
      if (x > this.maxX) x = this.maxX
      if (x < 0) x = 0
      this.oLump.style.cssText += `left:${x}px`
    }


    //松开点击  滑块静止
    document.onmouseup = (e) => {
      this.oTrack.onmousemove = null
      //防止再次点击再次触发
      document.onmouseup = null
      //防止误点滑块
      if (this.oLump.offsetLeft == 0) {
        return
      }
      //验证成功出现
      if (this.oLump.offsetLeft == this.maxX) {
        this.LumpFlag = true
        // document.onmouseup = null
       $(".reg_slide_track").css("display", "none")
      } else {
        //验证失败弹窗,滑块回到原位 
        this.oLump.style.cssText += `left:0px`
      }
    }
  }

}


new regUser()


$("main").click((e) => {
  let target = e.target

  //登入注册跳转
  if (target.classList.contains("login_msg_link")) {
    $(".login_pwd_box").css("display", "none")
    $(".findPwd").css("display", "none")
    $(".login_mag_box").css("display", "block")
  }
  if (target.classList.contains("login_reg_link")) {
    $(".login_pwd_box").css("display", "none")
    $(".login_mag_box").css("display", "none")
    $(".reg_box").css("display", "block")
  }
  if (target.classList.contains("login_find_link")) {
    $(".login").css("display", "none")
    $(".findPwd").css("display", "flex")
    // $(".findPwd").css("display", "flex")
  }
  if (target.classList.contains("login_pwd_link")) {
    $(".login").css("display", "flex")
    $(".login_mag_box").css("display", "none")
    $(".findPwd").css("display", "none")
    $(".reg_box").css("display", "none")
    $(".login_pwd_box").css("display", "block")
  }

  //点击输入框取消提示
  if (target.classList.contains("input_item")) {
    $(".reg_slide_tip").css("display", "inline")
    $(".slide_err_tip").css("display", "none")
    $(".tel_err_tip").css("display", "none")
    $(".code_err_tip").css("display", "none")
    $(".pwd_err_tip").css("display", "none")
    $(".nextpwd_err_tip").css("display", "none")
  }
})


// function rand(max, min) {
//   return Math.floor(Math.random() * (max - min) + min)
// }